<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        #div1{
            width: 300px;
            height: 100px;
            background: #9da;
            position: absolute;
        }
    </style>
</head>
<body>
<div id="div1"></div>
<script>
//    function show(a, b) {
//        alert('this:'+this+'\na:'+a+'\nb:'+b);
//    }
//    show(12,4);
//    show.call("that",12,4);  第一个作为this  这是call的用法

//    function A() {
//        this.abc =12;
//    }
//    a.prototype.show = function () {
//        alert(this.abc);
//    }
//
//
//    //继承A
//function B() {
//        //this=>new B()
//    A.call(this);
//}
//
////
//B.prototype = A.prototype;

    window.onload = function () {
        var oDiv=document.getElementById('div1');
        oDiv.onmousedown=function (e) {
            var oEvent = e||event;

            var disX =oEvent.clientX - oDiv.offsetLeft;
            var disY =oEvent.clientY - oDiv.offsetTop;

            console.log(disX);
            console.log(disY);

            document.onmousemove = function (e) {
                console.log("asd");
                var oEvent = e||event;
                oDiv.style.left = oEvent.clientX - disX+'px';
                oDiv.style.top = oEvent.clientY - disY+'px';
            }

            document.onmouseup = function () {
                document.onmousemove = null;
                document.onmouseup = null;
            }
        }
    }
</script>
</body>
</html>
<!--show() => show.call()-->
<!--call还有个特点(功能)-->
<!--可以改变函数执行时的this-->


<!--引用？？？-->
<!--arr1 = [1,2,3,4]-->
<!--arr2=arr1;-->

<!--arr1?    //4-->
<!--arr2?    //4-->
<!--因为用到了引用，就是说arr2会指向arr1所在的空间-->
<!--解决的方法-->
<!--就是arr2=[] 空数组  让arr1 全部推进arr2-->
<!--同样的方法适用于prototype-->

<!--通过call来继承父级的属性-->
<!--通过让prototype相等-->
<!--B.prototype = A.prototype;  这里就用到了引用-->
<!--解决B.prototype 会破坏A.prototype-->
<!--所以解决方法：-->

<!--for(var i in A.prototype)-->
<!--{-->
    <!--B.prototype[i] = A.prototype[i];-->
<!--}-->






